import { Switch, Widget, Box } from "@/focusSolid";
import { For, createSignal } from "solid-js";
import "./index.less";

export default function Page() {
  const [dataBox] = createSignal(new Array(15).fill("box"))
  const [dataArr] = createSignal(new Array(8).fill("widget"))

  return <Switch>
    <div class="page">
      <For each={dataBox()}>
        {v => <Box class="focus-box">
          <For each={dataArr()}>
            {val => <Widget class="focus-item">widget=={v}-{val}</Widget>}
          </For>
        </Box>}
      </For>
      <For each={dataArr()}>
        {val => <Widget class="focus-item">widget=={val}</Widget>}
      </For>
    </div>
  </Switch>
}